<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>自适应卡片</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div class="container">
    <div class="imgBx">
      <img src="shoe.png">
    </div>
    <div class="details">
      <div class="content">
        <h2>Nike球鞋<br><span>漫步者2019夏季</span></h2>
        <p>Lorem ipsum dolor sit amet consectetur
          adipisicing elit. Veniam voluptate cons
          ectetur nobis sunt repellendus necessi
          tatibus dolorum natus maiores cum adip
          isci non, autem, at velit libero nemo 
          voluptatibus aliquid sapiente exercitationem?</p>
        <h3>$199.99</h3>
        <button>加入购物车</button>
      </div>
    </div>
  </div>
</body>
</html>